<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>视频列表</title>
		<base href="../../../" />
		<script src="lib/function/responsive.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="static/css/api.css" />
		<link rel="stylesheet" type="text/css" href="static/css/aui-pull-refresh.css"/>
		<style>
			body{padding-top:1.3rem;height:100%;box-sizing: border-box;}
			#header{
				position: fixed;
				top: 0;
				left: 0;
				width: 100%;
				background-color: #fff;
				z-index: 99;
				box-shadow: 0 0 10px 3px
				rgba(205, 205, 205, 0.45);
				/* box-shadow: 0rem 0rem 0.17rem 0.04rem
				rgba(205, 205, 205, 0.45); */
			}
			#header .header-box{
				display: flex;
				justify-content: space-between;
				height: 1.06rem;
			}
			#header .return{
				width: 1.4rem;
				height: 1.06rem;
				line-height: 1.06rem;
				box-sizing: border-box;
				padding-left: 0.65rem;
				font-size: 0.22rem;
				color: #333333;
				background: url(static/icon/back.png) no-repeat left 0.3rem center;
				background-size: 0.18rem;
			}
			#header .return:active,#header .home:active{
				opacity: 0.6;
			}
			#header .name{
				line-height: 1.06rem;
				font-size: 0.28rem;
				font-weight: bold;
				color: #333333;
			}
			#header .home{
				width: 1.4rem;
				height: 1.06rem;
				background: url(static/icon/home.png) no-repeat right 0.3rem center;
				background-size: 0.44rem;
			}
			
			.videolist{
				padding: 0.3rem;
				overflow: hidden;
			}
			.videolist-lis{
				width: 9.14rem;
				height: 6rem;
				background-color: #000;
				margin: 0.3rem 0.3rem 0 0;
				float: left;
			}
			.videolist-lis:nth-child(2n){
				margin-right: 0;
			}
			.videolist-lis video{
				display: block;
				width: 100%;
				height: 100%;
			}
			.nomore{
				line-height: 1.5rem;
				text-align: center;
				font-family: MicrosoftYaHei;
				font-size: 0.22rem;
				color: #cdcdcd;
			}
		</style>
	</head>
	<body>
		<div id="header">
			<div class="header-box">
				<div i18n="return" class="return" id="close">返回</div>
				<div i18n="more.videos" class="name">更多视频</div>
				<div class="home" id="close"></div>
			</div>
		</div>
		<div class="aui-refresh-content">
		<div class="videolist" id="list-box">
			
			<div class="videolist-lis">
				<video class="video-js" controls playsinline preload="auto" style="object-fit:fill;"  poster="img/img1.jpg" data-setup="{}">
					<source src="mov_bbb.mp4" type="video/mp4">
					<p class="vjs-no-js"> To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a> </p>
				</video>
			</div>
			
		</div>
		<div class="mescroll-upwarp hidden">
		  <p class="upwarp-progress mescroll-rotate"></p><p class="upwarp-tip"  i18n="loading">加载中...</p>
		</div>
		<div class="no-data hidden"  i18n="loading.completed">-- 加载完毕 --</div>
		</div>
		<!-- <div class="nomore">没有更多了~</div> -->
		<script type="text/javascript" src="runtime/pub.js"></script>
		<script src="dist/i18n.js"></script>
		<script type="text/javascript" src="runtime/index/videolist.js"></script>
	</body>
</html>
